<template lang="pug">
.patienProject
  .patienProject-header 
    .patienProject-header-left 
      Select(v-bind="selectProjectProps",v-model="projects")
      Select(v-bind="selectPartProps",v-model="part")
    .patienProject-header-right 
      mt-button(type="primary" @click="addClick") 添加
  .patienProject-body 
    mt-table(
      v-bind="tableProps"
    )
</template>

<script setup lang="ts">
import {
  type SelectProps,
  type TableProps,
  Select,
  useNotify
} from "@scmt/common-components";
import { useRequest } from "@scmt/common-hooks";
import { type QueryPagination, useApi } from "@scmt/core-api";
import type { ProjectEntity, ProjectQueryParams } from "@scmt/api-pacs-project";
import type { RegistrationProjectEntity } from "@scmt/api-pacs-registration-project";
import type { RegistrationPartEntity } from "@scmt/api-pacs-registration-part";
//添加 Props属性
const props = defineProps({
  selectRegistration: Object,
});
//添加事件
const emit = defineEmits(["changEquipment", "changProject", "changPart"]);
const $api = useApi();
const queryPramas = reactive<ProjectQueryParams>({
  name: "",
  pageNum: 1,
  pageSize: 20,
});
const $notify = useNotify();
/**
 * 部位表格数据
 */
const partTableData = ref<Array<RegistrationPartEntity>>([]);
const equipment = ref("");
const projects = ref("");
const part = ref("");
const params = Object.assign(queryPramas);
const { request, data, loadingMap } = useRequest({
  tableData: (q: any) => {
    const params = Object.assign(queryPramas, q);
    return $api.pacs.project.query(params);
  },
  projectOptions: $api.pacs.project.listByDeviceIdAsOptions,
  equipment: async () => {
    return await $api.pacs.checkEquipment.listAsOptions();
  },
  partOptions: $api.pacs.part.listByDeviceIdAsOptions,
});
/**
 * 设备选择下拉框属性
 */
// const selectEquipmentProps = computed<SelectProps>(() => {
//   const props: SelectProps = {
//     options: data.equipment ?? [],
//     separator: ",",
//     placeholder: "请选择设备",
//     multiple: false,
//     tableColumns: [
//       {
//         prop: "deviceName",
//         label: "设备名称",
//       },

//       {
//         prop: "inspectionType",
//         label: "检查类型",
//       },
//     ]
//   };

//   return props;
// });

/**
 * 部位选择下拉框属性
 */
const selectPartProps = computed<SelectProps>(() => {
  const props: SelectProps = {
    options: data.partOptions ?? [],
    placeholder: "请选择部位",
    separator: ",",
    multiple: true,
    filterable: true,
    clearable: true,
  };

  return props;
});
/**
 * 项目选择下拉框属性
 */
const selectProjectProps = computed<SelectProps>(() => {
  const props: SelectProps = {
    options: data.projectOptions ?? [],
    placeholder: "请选择项目",
    separator: ",",
    multiple: false,
    filterable: true,
    clearable: true,
  };
  return props;
});
/**
 * 表格数据
 */
const projectTableData = ref<Array<RegistrationProjectEntity>>([]);
/**
 * 表格属性（Props）
 */
const tableProps = computed(() => {
  const tableProps: TableProps = {
    loading: loadingMap.tableData,
    data: projectTableData.value,
    columns: [
      {
        prop: "projectName",
        label: "项目名称",
        tooltip: true,
        minWidth: "120px",
      },
      {
        prop: "partName",
        label: "部位名称",
        tooltip: true,
        minWidth: "120px",
      },


    ],
    onPaginate: (pagination: QueryPagination) =>
      request("tableData", pagination),
  };
  return tableProps;
});

//添加事件
const addClick = () => {
  if (!projects.value || projects.value.trim().length <= 0) {
    $notify.warning("请先选择检查部位！！");
    return;
  }
  if (!part.value || part.value.trim().length <= 0) {
    $notify.warning("请先选择检查部位！！");
    return;
  }
  let res = data.projectOptions ?? [];
  if (res.length > 0) {
    let filter = res.filter((i) => projects.value.indexOf(i.value + "") > -1);
    if (filter && filter.length > 0) {

      const projectModel = ref<{} | ProjectEntity>({});

      let resPart = data.partOptions ?? [];
      let filterPart = resPart.filter((i) => part.value.indexOf(i.value + "") > -1);
      let partName = "";
      if (filterPart && filterPart.length > 0) {
        let partNames = filterPart.map(i => i._raw?.partName);
        partName = partNames.join(",");
      }
      projectModel.value = {
        id: filter[0].value,
        partId: part.value,
        partName: partName,
        projectName: filter[0].label,
        projectCode: filter[0]._raw?.projectCode,
        projectPrice: filter[0]._raw?.basicPrice,
        registrationId: props.selectRegistration?.ids,
        deviceId: props.selectRegistration?.deviceId,
        createId: "", //临时用于区分是否带过来的
      };
      let model = $api.pacs.registrationProject.$$createEntity(
        projectModel.value
      );
      projectTableData.value.push(model);
      emit("changProject", projectTableData.value);
      projects.value = "";
      part.value = "";
    }
  }
};
watch(
  () => props.selectRegistration?.id,
  (item) => {
    //查询设备
    request("equipment", {});
    projects.value = "";
    part.value = "";
    projectTableData.value = [];
    partTableData.value = [];
    data.projectOptions = [];
    if (item) {
      equipment.value = "";
      if (!props.selectRegistration?.deviceId) {
      }
      //回显登记单项目
      if (
        props.selectRegistration?.registrationProjectList &&
        props.selectRegistration?.registrationProjectList.length > 0
      ) {
        props.selectRegistration?.registrationProjectList.forEach(
          (item: any) => {
            const project = ref<{} | ProjectEntity>({});
            project.value = {
              id: item.id,
              projectName: item.projectName,
              projectCode: item.projectCode,
              basicPrice: item.basicPrice,
              partId: item.partId,
              partName: item.partName,
              registrationId: props.selectRegistration?.ids,
              deviceId: props.selectRegistration?.deviceId,
              createId: item.id, //临时用于区分是否带过来的
            };
            let model = $api.pacs.registrationProject.$$createEntity(
              project.value
            );
            projectTableData.value.push(model);
          }
        );
        emit("changProject", projectTableData.value);
      }
    }
  },
  {
    immediate: true,
  }
);
//监听设备选择改变
watch(
  () => props.selectRegistration?.deviceId,
  (item) => {
    projects.value = "";
    if (projectTableData.value.length > 0) {
      projectTableData.value = projectTableData.value.filter(
        (ii) => ii.createId != ""
      );
    } else {
      projectTableData.value = [];
    }
    data.projectOptions = [];
    emit("changEquipment", item);
    if (item && item.trim().length > 0) {
      params.value = Object.assign(
        {
          deviceId: item,
        },
        queryPramas
      );
      request("projectOptions", params.value);
    }
    if (partTableData.value.length > 0) {
      partTableData.value = partTableData.value.filter(
        (ii) => ii.createId != ""
      );
    } else {
      partTableData.value = [];
    }
    part.value = "";
    data.partOptions = [];
    if (item && item.trim().length > 0) {
      params.value = Object.assign(
        {
          deviceId: item,
        },
        queryPramas
      );
      request("partOptions", params.value);
    }
  },
  {
    immediate: true,
  }
);
// //监听设备选择改变
// watch(
//   () => equipment.value,
//   (item) => {
//     projects.value = "";
//     if (projectTableData.value.length > 0) {
//       projectTableData.value = projectTableData.value.filter(
//         (ii) => ii.createId != ""
//       );
//     } else {
//       projectTableData.value = [];
//     }
//     data.projectOptions = [];
//     emit("changEquipment", item);
//     if (item && item.trim().length > 0) {
//       params.value = Object.assign(
//         {
//           deviceId: item,
//         },
//         queryPramas
//       );
//       request("projectOptions", params.value);
//     }
//   },
//   {
//     immediate: true,
//   }
// );
// //监听项目选择改变
// watch(
//   () => projects.value,
//   (item) => {
//     if (projectTableData.value.length > 0) {
//       projectTableData.value = projectTableData.value.filter(
//         (ii) => ii.createId != ""
//       );
//     } else {
//       projectTableData.value = [];
//     }
//     if (item && item.trim().length > 0) {
//       let res = data.projectOptions ?? [];
//       if (res.length > 0) {
//         let filter = res.filter((i) => item.indexOf(i.value + "") > -1);
//         if (filter && filter.length > 0) {
//           filter.forEach((ii) => {
//             const project = ref<{} | ProjectEntity>({});
//             project.value = {
//               id: ii.value,
//               projectName: ii.label,
//               projectCode: ii._raw?.projectCode,
//               basicPrice: ii._raw?.basicPrice,
//               registrationId: props.selectRegistration?.ids,
//               deviceId: props.selectRegistration?.deviceId,
//               createId: "", //临时用于区分是否带过来的
//             };
//             let model = $api.pacs.registrationProject.$$createEntity(
//               project.value
//             );
//             projectTableData.value.push(model);
//           });
//           emit("changProject", projectTableData.value);
//         }
//       }
//     }
//   },
//   {
//     immediate: true,
//   }
// );
// //监听选项变
// watch(
//   () => part.value,
//   (item) => {
//     if (item) {
//       if (partTableData.value.length > 0) {
//         partTableData.value = partTableData.value.filter(
//           (ii) => ii.createId != ""
//         );
//       } else {
//         partTableData.value = [];
//       }
//       if (item && item.trim().length > 0) {
//         let res = data.partOptions ?? [];
//         if (res.length > 0) {
//           let filter = res.filter((i) => item.indexOf(i.value + "") > -1);
//           if (filter && filter.length > 0) {
//             filter.forEach((ii) => {
//               const project = ref<{} | RegistrationPartEntity>({});
//               project.value = {
//                 id: ii.value,
//                 partName: ii.label,
//                 partCode: ii._raw?.partCode,
//                 registrationId: props.selectRegistration?.ids,
//                 deviceId: props.selectRegistration?.deviceId,
//                 createId: "",
//               };
//               let model = $api.pacs.registrationPart.$$createEntity(
//                 project.value
//               );
//               partTableData.value.push(model);
//             });
//             emit("changPart", partTableData.value);
//           }
//         }
//       }
//     }
//   },
//   {
//     immediate: true,
//   }
// );
</script>

<style lang="less" scoped>
.patienProject {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding-top: var(--mt-padding);
  overflow: hidden;

  .mt-select {
    margin-bottom: 10px;
  }

  .mt-table__pagination {
    display: none;
  }

  &-header {
    flex-shrink: 0;
    display: flex;

    &-right {
      flex-shrink: 0;
      margin-left: 5px;
    }

    &-left {
      display: flex;
      flex: 1;

      .mt-select {
        margin-right: 5px;
      }
    }
  }

  &-body {
    flex: 1;
  }
}
</style>
